import React from 'react';
import {DragColumnsProps, SortItem} from "./type";
import SortableList from "@/lib/react-native-sortable-list";
import DragRow from "./DragRow";
import {Vibration} from "react-native";


const DragColumns = <T, >(props: DragColumnsProps<T>) => {
    const {
        renderRow,
        labelMaps,
        data,
        onRemove,
        onActivateRow,
        ...attrs
    } = props;


    const renderItem = React.useCallback((prop: SortItem) => {
        return <DragRow {...prop} labelMaps={labelMaps} onRemove={onRemove}></DragRow>
    }, [labelMaps, data])

    function handleActivateRow(key:string){
        Vibration.vibrate(15);
        onActivateRow && onActivateRow(key);
    }

    return (
        <>
            {
                data.length > 0 &&
                <SortableList
                    renderRow={typeof renderRow === 'function' ? renderRow : renderItem}
                    data={data}
                    {...attrs}
                    onActivateRow={handleActivateRow}
                >
                </SortableList>
            }
        </>
    );
};

export default DragColumns;